<main id="content-container" class="container" role="main">
  <div class="row" style="margin-top:20px;">

    <div class="col-md-10 col-md-offset-1 well bg-dark" style="min-height:600px;">

      <div class="jumbotron">
        <h1>Current Matches</h1>
        <% if @matches.blank? %>
          <p>You currently do not have matches.
          </p>
        <% else %>
          <p>The list of current matches for all your fighters.
          </p>
        <% end %>
      </div>

      <div class="col-md-12" style="margin-top:30px; margin-bottom:30px;">

        <div class="col-md-10 col-md-offset-1">
        <% for @match in @matches %>

          <div class="media" style="color: white;">

             <% for @fighter in @match.fighters %>

              <div class="pull-left" style="width:190px;">
                <%= link_to image_tag(fighter_avatar_url(@fighter), :class=>"media-object img-thumbnail img-mid"), fighter_path(@fighter) %>
                <h4 class="red"><strong><%= @fighter.nickname.upcase %></strong></h4>
                <h4><%= @fighter.name.upcase %></h4>
              </div>
            <% end %>
            <div class="pull-left">
              <p><%= link_to "Fightere Fight No #{@match.id}", @match %></p>
              <p><%= link_to "Ladder #{@match.ladder.city}, Round N", @match.ladder %></p>

              <p class="header">Match Result</p>
              <p class="header">Held on: <%= @match.held_on %></p>
              <p class="header">Location: <%= @match.location %></p>
              <p class="header">Status: <%= @match.status %></p>
              <p class="header">Result: <%= @match.result %></p>
            </div>

          </div>
        <% end %>
        </div>

        <h4 class="page-header grey bd-grey">Completed matches</h4>

        <div class="col-md-10 col-md-offset-1">
        <% for @match in @matches %>

          <div class="media" style="color: white;">

             <% for @fighter in @match.fighters %>

              <div class="pull-left" style="width:190px;">
                <%= link_to image_tag(fighter_avatar_url(@fighter), :class=>"media-object img-thumbnail img-mid"), fighter_path(@fighter) %>
                <h4 class="red"><strong><%= @fighter.nickname.upcase %></strong></h4>
                <h4><%= @fighter.name.upcase %></h4>
              </div>
            <% end %>
            <div class="pull-left">
              <p><%= link_to "Fightere Fight No #{@match.id}", @match %></p>
              <p><%= link_to "Ladder #{@match.ladder.city}, Round N", @match.ladder %></p>

              <p class="header">Match Result</p>
              <p class="header">Held on: <%= @match.held_on %></p>
              <p class="header">Location: <%= @match.location %></p>
              <p class="header">Status: <%= @match.status %></p>
              <p class="header">Result: <%= @match.result %></p>
            </div>

          </div>
        <% end %>
      </div>
      </div>
    </div>

  </div>
</main>

